<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Welcome To AjaxLab.com</title>

<link href="ScriptLibrary/windows_js_0.85.2/themes/default.css" rel="stylesheet" type="text/css" >	 </link>
<link href="ScriptLibrary/windows_js_0.85.2/themes/theme1.css" rel="stylesheet" type="text/css" >	 </link>	 
<link rel="stylesheet" type="text/css" href="ScriptLibrary/windows_js_0.85.2/themes/mac_os_x.css">	</link>

<link rel="stylesheet" type="text/css" href="ScriptLibrary/windows_js_0.85.2/themes/alphacube.css"></link>

<style type="text/css">
	body {
	margin:20px 20px 0px 20px;
	background-color: #CCCCFF;
		}
	
	#main {
		border:1px solid #000; 
		background:#fff;
		}

/* Looks like you have to specify the width of #menu
or IE5 Mac stretches it all the way across the div, and 
Opera streches it half way. */

	#main #menu {
		border-left:1px solid #000; 
		border-bottom:1px solid #000;
		float:right;
		width:230px;
		background:#eee;
		margin:0px 0px 10px 10px;
		
		}
	
	#main #resources{
		border-top: 1px solid #000;
		border-left:1px solid #000; 
		border-bottom:1px solid #000;
		float:right;
		width:230px;
		background:#eee;
		margin:0px 0px 10px 10px;
		clear: right;
	}
	
	#main #css_resources{
		border-top: 1px solid #000;
		border-left:1px solid #000; 
		border-bottom:1px solid #000;
		float:right;
		width:230px;
		background:#eee;
		margin:0px 0px 10px 10px;
		clear: right;
	}
			
	p,h1,pre {
		margin:0px 10px 10px 10px;
		}
		
	h1 {
		font-size:14px;
		padding-top:10px;
		}
	
	#menu p { font-size:10px}
</style>
	
<script language="JavaScript" type="text/javascript" src="ScriptLibrary/Atlas/Release/AtlasCompat.js"></script>
<script language="JavaScript" type="text/javascript" src="ScriptLibrary/Atlas/Release/Atlas.js"></script>

<script language="JavaScript" type="text/javascript" src="ScriptLibrary/scriptaculous-js-1.6.0/lib/prototype.js"></script>
<script language="JavaScript" type="text/javascript" src="ScriptLibrary/scriptaculous-js-1.6.0/src/effects.js"></script>
<script language="JavaScript" type="text/javascript" src="ScriptLibrary/windows_js_0.85.2/javascripts/window.js"></script>


<script language="JavaScript" type="text/javascript" src="ScriptLibrary/AjaxLabCommandPrompt/Engine/Abstract/CMD.js"></script>
<script language="JavaScript" type="text/javascript" src="ScriptLibrary/AjaxLabCommandPrompt/Engine/Core/CMD.js"></script>

<script type="text/javascript">
	
	
	function pageLoad()
	{
		openDebugWindow();
		openCmd();
		
    }
	
	function openCmd()
	{
		var cmd = new AjaxLab.Engine.Core.Cmd("Cmd","CmdPrompt","item","http://www.ajaxlab.com");
		cmd.setIsDebug(false);
		openContentWindow();
	}
	
	function openContentWindow() {

			var contentWin = new Window('content_win', {
													className: "alphacube",
													title: "AjaxLab Command Prompt",
													maximizable: true, 
													resizable: true, 
													closable: false,
													hideEffect:Element.hide, 
													showEffect:Element.show
													}
									)

			var width = $('test_content').offsetWidth;
			var height = $('test_content').offsetHeight;
			contentWin.setContent('test_content', true, true);
			contentWin.setSize(width,height);
			contentWin.setLocation(20,120);
			contentWin.toFront();
			contentWin.setDestroyOnClose();
			contentWin.show();
			//contentWin.showCenter(true);	
			var myObserver = { 
				onEndResize	:	function(eventName, win)
				{
					if(win == contentWin)
					{
						$('CmdPrompt').style.width = win.width-15+"px";
						$('CmdPrompt').style.height = win.height-15+"px";
					}
				}, 
				
				onEndMaximize: function(eventName, win)
				{
					if(win == contentWin)
					{
						$('CmdPrompt').style.width = win.width-15+"px";
						$('CmdPrompt').style.height = win.height-15+"px";
					}
				}
			}
			Windows.addObserver(myObserver);
	}
	
	function openDebugWindow()
	{
			var contentWin = new Window('content_debug', {
													className: "dialog",
													title: "AjaxLab Command Prompt Debug",
													maximizable: true, 
													resizable: true,
													closable: false, 
													hideEffect:Element.hide, 
													showEffect:Element.show
													}
									)
			var width = $('item').style.width;
			var height = $('item').style.height;
			contentWin.setContent('item', true, true);
			contentWin.setLocation(20,120);
			contentWin.setSize(width,height);
			contentWin.toFront();
			contentWin.setDestroyOnClose();
			contentWin.show();	
			var myObserver = { 
				onEndResize	:	function(eventName, win)
				{
					if(win == contentWin)
					{
						$('item').style.width = win.width+"px";
						$('item').style.height = win.height+"px";
					}
				},
				
				onEndMaximize: function(eventName, win)
				{
					if(win == contentWin)
					{
						$('item').style.width = win.width+"px";
						$('item').style.height = win.height+"px";
					}
				}
				
			}
			Windows.addObserver(myObserver);
	}
	
	
</script>

</head>

<body>

	<table id="test_content">
	<tr>
		<td>
			<textarea style="background:#000000; color:#ffffff" id="CmdPrompt"  cols="80" rows="20" wrap="virtual" ></textarea>		
		</td>
	</tr>
	</table>
	
	
	<DIV id="myDiv" style="border:1px solid red; z-index:10; left:0; top:0;
	position: absolute; background-color: yellow; padding:2px; display:none
	">Suggested text</DIV>

	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>Feature</p>
	<ul>
      <li>allow users to easily create their own commands for ajax actions. (done)
        <ul>
            <li>Example, user can create their own commands like &quot;ReadRSS&quot;, &quot;OpenMail&quot;, &quot;MonitorLog&quot;, &quot;search&quot;, &quot;add blog&quot; or whatever </li>
            <li>All build-in commands such far are created using this pluggable architecture. Implement one class, register it in a config file. That's it. </li>
        </ul>
      </li>
	  <li>log4j implementation (done, what i need anyway)</li>
</ul>
	<p>&nbsp;</p>
	<p>Commands Supported For Alpha Testing:</p>
	<ul>
	  <li>clear</li>
      <li>clear debug</li>
      <li>disable debug</li>
      <li>disable debug clear</li>
      <li>enable debug  </li>
      <li>openurl [your url] for example: openurl http://www.limingxu.com
        <ul>
          <li>If no url is specified, simply type &quot;openurl&quot; (without quote), then it takes the command prompt root value as the url</li>
          <li>you must specify http:// in front as window don't recognize site start with www only. </li>
        </ul>
      </li>
      <li>cd [directory] for example: cd http://www.limingxu.com</li>
</ul>
	<p>&nbsp;</p>
	<div id="main" style="display:none">
		  <div id="menu">
						<blockquote>
						  <h1>Annoucement</h1>
						  <pre>All pages in AjaxLab will<br />be designed with pure CSS.
		with the exception of the
		output produced by
		some of the third party
		libraries software. </pre>
		    </blockquote>
		  </div>
		   <div id="resources">
					   <blockquote>
					     <h1>Resources</h1>
					     <pre><a href="http://ajax.schwarz-interactive.de/csharpsample/default.aspx" target="_blank">Ajax.NET</a> - Third party <br />library that simplifies
						Ajax in .NET, great<br />library!
						<br /><a href="http://sarissa.sourceforge.net/doc/">Sarisa</a> - Cross browser
						dhtml library for xml data</pre>
		     </blockquote>
		   </div>
			<div id="css_resources">
				<blockquote>
				  <h1>Css Links</h1>
				  <pre><a href="http://www.alistapart.com/" >AListApart</a><br/><a href="http://www.csszengarden.com/" >CssZenGardern</a><br/><a href="http://www.zeldman.com/dwws/" >zeldman</a>
				  </pre>
			  </blockquote>
			</div>
			<blockquote>
			  <h1><strong>Purpose:</strong></h1>
			  <p class="greek">
			    This main site will be dedicated to examples, tutorials, application ideas/impementations needed to create a real world scenario application with emphasis on .NET infrastructure 
			    <br />
			      <br />
			    Topics will also include 
		      </p>
			  <ul>
			    <li>javascript tutorials,</li>
			    <li> css turtorials,</li>
			    <li> third party dhtml libraries, utilities</li>
			    <li>ajax tuotrials in .NET </li>
		      </ul>
			  <p>Thinking about setting up the following structure. </p>
			  <ul>
			    <li>css.AjaxLab.com License LGPL </li>
			    <li>javascript.AjaxLab.com License LGPL</li>
			    <li> blog.AjaxLab.com License LGPL </li>
		      </ul>
			  <p>Debug Zone:</p>
			  <ul>
			    <li> </li>
		      </ul>
	  </blockquote>
			<ul>
				<li><div id="item" style="background-color:black; font-size:12px;
								  height:200px;width:750px; overflow:scroll">
					
					
				  </div>
				</li>
			</ul>
			<blockquote>
			  <p>&nbsp;</p>
			  <p>Common Javascript Classes </p>
			  <ul>
			    <li><a href="http://www.trimpath.com/project/wiki">TrimPath Projects </a></li>
			    <li><a href="http://www.edwardh.com/jsunit/">JsUnit testing framework </a></li>
			    <li><a href="http://jsassertunit.sourceforge.net/docs/index.html">Javascript Assertion Framework </a></li>
			    <li><a href="http://jsval.fantastic-bits.de/">JsValide validation framework </a></li>
			    <li><a href="http://eric-blue.com/projects/jsmf/#toc5"> JSMF - JavaScript State Management Framework  </a></li>
			    <li><a href="http://cross-browser.com/toys/">XLibrary: http://cross-browser.com/toys/</a></li>
			    <li><a href="http://dynapi.sourceforge.net/releases/dynapi-3.0.0-beta1/examples">Dynapi 3.1beta </a></li>
			    <li><a href="http://tool-man.org/examples/">Toolman DHTML library </a></li>
			    <li><a href="http://www.youngpup.net/2001/domdrag">Dom Drag and Drop </a></li>
			    <li><a href="http://openrico.org/home.page">Rico</a></li>
			    <li><a href="http://script.aculo.us/">Script.aculo.us</a></li>
			    <li><a href="http://www.uwyn.com/projects/relativelayers/documentation/index.html">RelativeLayer Library </a></li>
			    <li><a href="http://qooxdoo.sourceforge.net/">QooXdoo</a></li>
			    <li><a href="http://www.walterzorn.com/dragdrop/dragdrop_e.htm">WalterZorn Drag and Drop</a></li>
			    <li><a href="http://www.pengoworks.com/index.cfm?action=get:qforms">QForms</a></li>
			    <li><a href="http://www.formassembly.com/">Form Assembly </a></li>
			    <li><a href="http://fm.dept-z.com/">FM project </a>(.NET collection/Cryptogorahy port into Javascript)</li>
			    <li><a href="http://3dhtml.netzministerium.de/">3DHTML Library </a></li>
			    <li><a href="http://www.howtocreate.co.uk/jslibs/">Jslibs</a></li>
			    <li><a href="http://www-adele.imag.fr/%7Edonsez/cours/exemplescourstechnoweb/js_graphimg/#simple">Graph Builder </a></li>
			    <li><a href="http://www.dreamprojections.com/syntaxhighlighter/">Syntax Highlighter: http://www.dreamprojections.com/syntaxhighlighter/</a></li>
			    <li><a href="http://www.dithered.com/javascript/index.html">Javascript Library: http://www.dithered.com/javascript/index.html</a></li>
			    <li><a href="http://www.codeproject.com/csharp/JSCompress.asp">Javascript Compression: http://www.codeproject.com/csharp/JSCompress.asp</a></li>
			    <li><a href="http://webfx.eae.net/">WebFx Examples and Code </a></li>
			    <li><a href="http://www.whitefrost.com/projects/engine/">WhiteForest Engine </a></li>
			    <li><a href="http://mikewest.org/projects.php?action=viewProject&projectID=1">DataRequestor</a></li>
			    <li><a href="http://goog-ajaxslt.sourceforge.net/">Google Ajaxslt </a></li>
		      </ul>
			  <p>Useful DHTML Gui Components</p>
			  <ul>
			    <li><a href="http://www.aplus.co.yu/Sparks/ADxMenu/intro/">Adx Menu</a></li>
			    <li><a href="http://skmmenu.com/menu/">SkimMenu</a></li>
			    <li><a href="http://www.menulab.com/slidingmenu/index.aspx">SlideMenu</a></li>
			    <li><a href="http://ypslideoutmenus.sourceforge.net/demo/index.html">YPSlide Menu </a></li>
			    <li><a href="http://www.monket.net/wiki/monket-calendar/">Monket Calendar </a></li>
			    <li><a href="http://www.planscalendar.com/">PlansCalendar</a></li>
			    <li><a href="http://at-krays.com/csharp.html">MenuLab WebControls</a></li>
			    <li><a href="http://at-krays.com/csharp.html">AtKays WebControls </a></li>
			    <li><a href="http://www.dynarch.com/projects/calendar/">Coolest Calendar </a></li>
			    <li><a href="http://www.codeproject.com/jscript/DHTMLHierarchicalWebTab.asp">Tab Widget </a></li>
			    <li><a href="http://phrogz.net/JS/Tabtastic/index.html#overview">Tabstic</a></li>
			    <li><a href="http://www.gazingus.org/html/menuExpandable.html">Expandable Menu </a></li>
			    <li><a href="http://www.obout.com/">Obout WebControls</a></li>
			    <li><a href="v"> TimothyHumphrey.WebControls </a></li>
			    <li><a href="http://www.eworldui.net/CustomControls/default.aspx">Eword UI Controls </a><br />
		        </li>
		      </ul>
			  <p>Techniques</p>
			  <ul>
			    <li>Sort Table
			      <ul>
			        <li><a href="http://www.kryogenix.org/code/browser/sorttable/">http://www.kryogenix.org/code/browser/sorttable/</a></li>
			        <li><a href="http://webfx.eae.net/dhtml/sortabletable/sortabletable.html">http://webfx.eae.net/dhtml/sortabletable/sortabletable.html </a><a href="http://www.brainjar.com/terms.asp">http://www.brainjar.com/terms.asp</a></li>
			        <li><a href="http://www.mattkruse.com/javascript/">http://www.mattkruse.com/javascript/ </a><a href="http://htmlcoder.visions.ru/JavaScript/?22">http://htmlcoder.visions.ru/JavaScript/?22 </a> </li>
			        <li><a href="http://www.brainjar.com/terms.asp">http://www.brainjar.com/terms.asp </a> </li>
			        <li><a href="http://htmlcoder.visions.ru/JavaScript/?22">http://htmlcoder.visions.ru/JavaScript/?22 </a></li>
			        <li><a href="http://javascript.weblogsinc.com/entry/7673671712513225/">http://javascript.weblogsinc.com/entry/7673671712513225/</a></li>
		          </ul>
		        </li>
			    <li>Sort List
			      (Dragable)
			      <ul>
			        <li><a href="http://blog.simon-cozens.org/6785.html">http://blog.simon-cozens.org/6785.html </a></li>
		          </ul>
		        </li>
		      </ul>
			  <p>Books</p>
			  <ul>
			    <li><a href="http://www.unix.org.ua/orelly/web/jscript/index.html">Javascript Definite Guide </a></li>
			    <li><a href="http://www.js-examples.com/javascript/core_js15/contents.php">Core Javascript 1.5 </a></li>
			    <li><a href="http://www.learnasp.com/freebook/learn/index.aspx">ASP.NET 
			      
			      
			      by Charles Carrol</a></li>
		      </ul>
			  <p>Javascript Reference</p>
			  <ul>
			    <li><a href="download/JSB5RefBooklet.pdf">Javascript Bible Reference </a></li>
		      </ul>
			  <p>Useful Javascript Sites</p>
			  <ul>
			    <li><a href="http://4umi.com/web/javascript/">http://4umi.com/web/javascript/ </a></li>
			    <li><a href="http://www.irt.org/script/script.htm">http://www.irt.org/script/script.htm</a></li>
			    <li><a href="http://www.ajaxpatterns.org/"> http://www.ajaxpatterns.org/ </a></li>
			    <li><a href="http://www.technorati.com/tag/ajax">http://www.technorati.com/tag/ajax</a></li>
			    <li><a href="http://www.456bereastreet.com/">http://www.456bereastreet.com/</a></li>
			    <li><a href="http://slayeroffice.com/?c=/content/tools/showSource.html">http://slayeroffice.com/?c=/content/tools/showSource.html</a></li>
			    <li><a href="http://www.webreference.com/js/index.html">http://www.webreference.com/js/index.html</a></li>
			    <li><a href="http://www.howtocreate.co.uk/tutorials/index.php?tut=0&part=21">http://www.howtocreate.co.uk/tutorials/index.php?tut=0&amp;part=21</a></li>
		      </ul>
			  <p>Useful Javascript Tools</p>
			  <ul>
			    <li><a href="http://www.jcay.com/javascript-code-improver.html">http://www.jcay.com/javascript-code-improver.html </a></li>
			    <li><a href="http://jsdoc.sourceforge.net/">http://jsdoc.sourceforge.net/</a></li>
			    <li><a href="http://www.saltstorm.net/depo/esc/?pod=js">http://www.saltstorm.net/depo/esc/?pod=js</a></li>
			    <li></li>
		      </ul>
			  <p>Other Tools</p>
			  <ul>
			    <li><a href="http://www.nvu.com/screenshots.html">http://www.nvu.com/screenshots.html </a><br />
		        </li>
		      </ul>
			  <p>Nice Blogs/Links</p>
			  <ul>
			    <li><a href="http://jszen.blogspot.com/">http://jszen.blogspot.com/ </a></li>
			    <li><a href="http://www.ajaxian.com/">http://www.ajaxian.com/</a></li>
			    <li><a href="http://www.quirksmode.org/">http://www.quirksmode.org/</a></li>
			    <li><a href="http://javascript.weblogsinc.com/">http://javascript.weblogsinc.com/</a><br />
		        </li>
		      </ul>
			  <p>&nbsp; </p>
			  <p>(by <em>Liming Xu</em>) </p>
	  </blockquote>
	</div>






    <p>Bug</p>
    <ul>
      <li>http:// cause error, I think it's due to &quot;://&quot; as they might be speical characters. (fixed. I think) </li>
      <li>Log4J timestamp stay the same,  why? </li>
      <li>Log4J is copied via referecne. change root debug level in one class, all other classes are affected as well. That's fine, but I need to have one place to set the root debug level and then then entire app follows this setting, can't be changed. </li>
    </ul>
    <p>Performance</p>
    <ul>
      <li>when debug is on, if enter too many commands, it becomes slow. We have to enter the command - clear debug to be fast again</li>
      <li>Atlas size is big. (240KB), prototype (54.9kb), Scriptaculous (34.2 kb) , window class (35.9kb), Command Prompt Itself (22kb) Total: 387kb. This might be a problem. Should consider replace Atlas with another smaller framework that supports namespace, inheritance and interface. However, if used in .NET, atlas scriptmanger will cache its script, so it's perfectly fine. For non.NET platfrom however, I need to have another version? *Note, prototype/scriptaculous/window class is not necessary as I use them purely for decorating the textarea into a window. That's a whopping 100kb almost </li>
    </ul>
    <p>Libraries Used</p>
    <ul>
      <li>Atlas Javascript (just Atlas.js and AtlasCompat.js) no need for .net framework</li>
      <li>Prototype and scriptaculous (just for this pretty window. You don't have to use it. It's not part of the command prompt, i just use them to decorate this example and show there is no conflicts between them and Atlas. They play nicely togehter here) </li>
    </ul>
</body>
</html>
